<div class="musor" >
    <h1 class="big-title cyane rnd7">Műsornaptár</h1>
    <div id='mh-event-calendar'>
    </div>
</div>
<script src="<?php echo base_url(); ?>frontend_style/script/calendar/fullcalendar.min.js" type="text/javascript"></script> 
<script src="<?php echo base_url(); ?>frontend_style/script/calendar/gcal.js" type="text/javascript"></script> 
<script type="text/javascript" src="<?php echo base_url(); ?>frontend_style/script/jquery.xcolor.min.js"></script>
<script type="text/javascript" src="<?php echo base_url(); ?>frontend_style/script/jquery.dropshadow.js"></script>
<!-- GOOGLE SETTING <script src="<?php echo base_url(); ?>frontend_style/script/calendar/declaration.js" type="text/javascript"></script>-->

<script>
// JavaScript Document

	$.fn.extruder = function() {
    var depth = 10;
    var extrudeIt = $(this);
	var bgColor = extrudeIt.css('background-color');
	var bgColorDarker = $.xcolor.darken(bgColor);
	
	
	for (var i=1; i<=depth; i++)
	{
			extrudeIt.dropShadow({
			left    : i,
			top     : -i,
			blur    : 0,
			opacity : 1,
			color   : bgColorDarker}
		);
	}
};

// CALENDAR PLUGIN - DECLARATION
 
$(document).ready(function() {
	
    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();
		
    $('#mh-event-calendar').fullCalendar({
		
        header: {
            left: 'prev,next today',
            center: 'title',
            // right: 'month,agendaWeek,agendaDay',
            right: '',
            theme: false
				
        },
        columnFormat: {
            month: 'dddd',    // Mon
            week: 'dddd', // Mon 9/7
            day: 'dddd'  // Monday 9/7
        },
        editable: false,
        minTime: '11:00',
        firstDay: 1,
        axisFormat: 'H:mm' ,

        eventSources: [            

            
        {
            url: '<?php echo site_url('musor/ajax_get_musor') ?>',
            className: '3dBox' ,
            type: 'POST'
        }		
                	 	
        ],
        timeFormat: 'H:mm'	
		
    });
		// CALENDAR 3D effect
		
	




	
	$('.3dBox').each( function(){
	$(this).extruder();
	}
	)

});

</script>